<template>
     <div >
        <div class="selectStyle">
             <div class="item" :style="{'background':item}" v-for="(item,index) in list" :key="index" @click="change(item)"></div> 
        </div>
        <!-- 嵌套的元素 -->
        <Bro ></Bro>
     </div>
</template>

<script>
import Bro from './Lcomponents/Bro.vue'
export default {
   data(){
    return{
        list:['red','blue']
    }
   },
   components:{
    Bro
   },
   //提供数据
   provide(){  //全局变量
    return{
       bg1:'red',
       bg2:'blue'
    }
   },
   methods:{
    change(item){
         this._provided.bg = item
        
    }
   }
}
</script>

<style>
   .selectStyle{
      display:flex;
   }
   .item{
    height:100px;
    width: 50px;
   }
</style>